import Vue from 'vue'
import Router from 'vue-router'

import store from '../store'

// dashboard组件
import DashBoard from '@/pages/dashboard'
import Welcome from '@/pages/welcome'

//导入各个模块的路由 - 必须
import PersonalRoutes from './routes/personal'

// 404错误页
import ErrorRoutes from './routes/error'

// // // 商品页面(路由)
// import CommodityRoutes from './routes/goods'

// // // 后台管理页面
// import systemRoutes from './routes/system'

// 登录页面
import Login from '@/pages/login'

// 所有动态路由的映射
import * as RouteComponents from './map'
// console.log(systemRoutes)
// console.log(RouteComponents)

// 加载动画
import {
  Loading
} from 'element-ui'

import {
  Message
} from 'element-ui'

Vue.use(Router)

// 动态路由
let routes = []
if( store.state.system.routes && store.state.system.routes.length>0 ){
  routes = filterAsyncRouter (store.state.system.routes)
}
// console.log(...routes)
const router = new Router({
  routes: [
    {
      path: '/',
      redirect: '/dashboard'
    },
    // 动态路由
    // systemRoutes,
    // CommodityRoutes,
    {
      path: '/dashboard',
      name: 'DashBoard',
      component: DashBoard,
      redirect: '/dashboard/welcome',
      children: [
        PersonalRoutes,
        ...routes,
        {
          path: '/dashboard/welcome',
          component: Welcome,
        },
      ],
      meta: { //添加一个路由元信息，标记
        requiresAuth: true
      }
    },
    {
      path: '/login',
      name: 'Login',
      component: Login,
    },
    // ErrorRoutes
  ]
})

// 已经登录还是没有登录在缓存中获取（有access_token就是已经登录了）
function isLogin() {
  let token = store.state.user.adminInfo.access_token
  if (token != '') {
    return true
  }
  return false
}

// 检查当前账号角色是否有权限访问对应的页面
function isHasPower(to){
  // console.log(to.meta.requiresrole)
  if( to.meta.requiresrole ){ // 如果meta有鉴权信息
    // console.log(store.state.user.adminInfo.user_role)
    if( to.meta.requiresrole.includes(store.state.user.adminInfo.user_role * 1) ){ // 如果包含对应鉴权码就可以
      return true
    }
    return false
  }else{
    return true
  }
}

// 映射动态路由数据
function filterAsyncRouter (routes) {
  return routes.map(item => {
    // console.log(item)
    if(item.component){
      // 获取过来的路由的对应的组件是个名字，需要替换成对应的映射里面的组件
      item.component = RouteComponents[item.component]

      if(item.children && item.children.length){ // 如果当前子路由还有子路由，需要递归映射组件
        item.children.component = filterAsyncRouter (item.children)

      }
    }
    return item
  })
}
// var loadingInstance
// 使用路由前置守卫
router.beforeEach((to, from, next) => {
  Loading.service();
  // console.log(token)
  // 验证当前路由是否需要登录才能访问
  if (to.matched.some(record => record.meta.requiresAuth)) {
    if (isLogin()) {
      // 已经登录的话就不跳登录页了
      
      // 对已经登录的用户进行鉴权

      if(store.state.system.routes == null){ // 如果仓库的路由信息为null，就需要去请求数据获取
        // console.log(store.state.system.routes)
        Vue.prototype.$http.getSystemRoute().then(res => {
          // 存入到system的store中
          store.dispatch('system/saveRoutes',res.data.data)

          // 执行处理路由数据

          let menuList = res.data.data
          console.log( menuList )
          const routes = filterAsyncRouter(menuList)
          // console.log(...routes)
          router.addRoutes(routes)
          // console.log(router)
        })
      }

      if(isHasPower(to)){
        next()
      }else{
        next({
          path: '/error/401'
        })
      }

      
        next()
    } else {
      // 未登录 - 跳到登陆页面
      
        next({
          path: '/login',
          query: {
            // 登录成功后跳转的地址
            redirect: to.fullPath
          }
        })
    }
  } else {
    //不需要登录直接放行
   
      next()
  }
})

router.afterEach(route => {
  
    Loading.service().close();
})

export default router
